import React, { Component } from 'react';
import { object } from 'prop-types';
import Banner from './home/Banner';
import Title from './home/Title';
import Recommend from './home/Recommend';
import Latest from './home/Latest';
import Local from './home/Local';
import Distiction from './home/Distiction';

export default class HomeView extends Component {
  constructor(props) {
    super(props);
  }
  componentWillMount() {
    const {
      getBanner,
      getRecomdList,
      getExperList,
      getLatestList,
      getDistinctList
    } = this.props;
    getBanner();
    getRecomdList();
    getExperList();
    getLatestList();
    getDistinctList();
  }
  render() {
    const {
      bannerList,
      recomdList,
      latestList,
      experienceList,
      distinctList
    } = this.props;
    return (
      <div className="dfcc" style={{ marginBottom: '4rem' }}>
        <Banner bannerList={bannerList} />
        <div style={{ width: '100%' }}>
          <div className="content">
            {recomdList && recomdList.length > 0 ? (
              <section className="recomd">
                <Title enTitle="RECOMMANDATION" zhTitle="个性推荐" />
                <Recommend recommendList={recomdList} />
              </section>
            ) : null}
            {latestList && latestList.length > 0 ? (
              <section className="latest">
                <Title enTitle="LATEST INTELLIGENCE" zhTitle="最新情报" />
                <Latest latestList={latestList} />
              </section>
            ) : null}
            {experienceList && experienceList.length > 0 ? (
              <section className="local">
                <Title enTitle="EXPERIENCE" zhTitle="体验" />
                <Local experienceList={experienceList} />
              </section>
            ) : null}
            {distinctList && distinctList.length > 0 ? (
              <section className="distiction">
                <Title enTitle="DISTICTION" zhTitle="精选目的地" />
                <Distiction distinctList={distinctList} />
              </section>
            ) : null}
            <section className="booking" />
          </div>
        </div>
      </div>
    );
  }
}
HomeView.contextTypes = {
  router: object.isRequired
};
